lg_sure_request();
/*-----显示子菜单-----*/
function display(lis) {
    lis.forEach(function (item) {
        item.style.display = 'block';
  })

}
/*-----隐藏子菜单-----*/
function hide(lis) {
    lis.forEach(function (item) {
        item.style.display = 'none';
  })
}

// nav的下拉菜单
var trends = document.querySelector('.trends');
var trends_ul_lis = document.querySelector('.trends_ul').querySelectorAll('li');
trends.addEventListener('mouseover', function () {
    display(trends_ul_lis);
})
trends.addEventListener('mouseout', function () {
    hide(trends_ul_lis);
})
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//记住账号密码显示
var local_username = window.localStorage.getItem('username');
var local_password = window.localStorage.getItem('password');
if (local_username != "" && local_password != "") {
    lg_username.value = local_username;
    lg_password.value = local_password;
}


//re_lg点击退出消失
var re_lg_out = document.querySelectorAll('.re_lg_out');
re_lg_out.forEach(function (item) {
    item.addEventListener('click', function () {
        re_lg.style.display = 'none';
    })
})




//用户注册提醒开始
var messages = document.querySelectorAll('p')
//密码规范  以字母开头，长度在6~18之间，只能包含字母、数字和下划线
    var password_reg = /^[a-zA-Z]\w{5,17}$/;
//账号规范  由10位数字组成
    var username_reg = /^\d{10}$/;
//名字规范  由2~10位汉字组成
    var name_reg = /^[\u4e00-\u9fa5]{2,10}$/
//手机号码规范 由13位数字组成
    var phone_reg = /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/
//注册事件  失去焦点
    
//建立一个变量，用于判断是否能够点击按钮
    var re_inputs = document.querySelectorAll('.re_input');
    let can = [0,0,0,0];
    for (let i = 0; i < re_inputs.length; i++) {
        re_inputs[i].onblur = function () {
            //下方文字恢复效果
            messages[i].style.fontSize = '16px'
            if (i == 0) {
                if (!username_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i].className = 're_username_message iconfont icon-zhuce'
                        messages[i].innerHTML = '请输入10位数字'
                        can[0] = 0;
                    } else {
                        messages[i].className = 're_username_message iconfont icon-cuowu wrong'
                        messages[i].innerHTML = '您输入的账号不符合要求'
                        can[0] = 0;
                    }  
                } else {
                    messages[i].className = 're_username_message iconfont icon-zhengque right'
                    messages[i].innerHTML = '您输入的账号格式正确'
                    can[0] = 1;
                }
            }
            if (i == 1) {
                if (!password_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i].className = 're_password_message iconfont icon-mima2'
                        messages[i].innerHTML = '以字母开头，长度在6~18之间，只能包含字母、数字和下划线'
                        can[1] = 0;
                    } else {
                        messages[i].className = 're_password_message iconfont icon-cuowu wrong'
                        messages[i].innerHTML = '您输入的密码不符合要求'
                        can[1] = 0;
                    }  
                } else {
                    messages[i].className = 're_password_message iconfont icon-zhengque right'
                    messages[i].innerHTML = '您输入的密码格式正确'
                    can[1] = 1;
                }  
            }
            if (i == 2) {
                if (!name_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i].className = 're_name_message iconfont icon-denglu'
                        messages[i].innerHTML = '请输入2~10位汉字'
                        can[2] = 0;
                    } else {
                        console.log('错误');
                        messages[i].className = 're_name_message iconfont icon-cuowu wrong'
                        messages[i].innerHTML = '您输入的名字不符合要求'
                        can[2] = 0;
                    }  
                } else {
                    messages[i].className = 're_name_message iconfont icon-zhengque right'
                    messages[i].innerHTML = '您输入的名字格式正确'
                    can[2] = 1;
                }  
            }
            if (i == 3) {
                if (!phone_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i].className = 're_phone_message iconfont icon-shouji'
                        messages[i].innerHTML = '请输入13位电话号码'
                        can[3] = 0;
                    } else {
                        console.log('错误');
                        messages[i].className = 're_phone_message iconfont icon-cuowu wrong'
                        messages[i].innerHTML = '您输入的电话号码不符合要求'
                        can[3] = 0;
                    }  
                } else {
                    messages[i].className = 're_phone_message iconfont icon-zhengque right'
                    messages[i].innerHTML = '您输入的电话号码格式正确'
                    can[3] = 1;
                }  
            }
        }
    }
//用户注册提醒结束

//登录提醒开始
var lg_inputs = document.querySelectorAll('.lg_input');
var can2 = [0, 0];
//输入时判断格式
    for (let i = 0; i < lg_inputs.length; i++) {
        lg_inputs[i].onblur = function () {
            console.log(111);
            //下方文字恢复效果
            messages[i + 4].style.fontSize = '16px'
            if (i == 0) {
                if (!username_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i + 4].className = 'lg_username_message iconfont icon-denglu'
                        messages[i + 4].innerHTML = '请输入10位数字'
                        can2[0] = 0;
                        console.log('空');
                    } else {
                        console.log('错误');
                        messages[i + 4].className = 'lg_username_message iconfont icon-cuowu wrong'
                        messages[i + 4].innerHTML = '您输入的账号不符合要求'
                        can2[0] = 0;
                    }
                } else {
                    messages[i + 4].className = 'lg_username_message iconfont icon-zhengque right'
                    messages[i + 4].innerHTML = '您输入的账号格式正确'
                    can2[0] = 1;
                    console.log(1);
                }
            }
            if (i == 1) {
                if (!password_reg.test(this.value)) {
                    if (this.value == '') {
                        messages[i + 4].className = 'lg_password_message iconfont icon-mima2'
                        messages[i + 4].innerHTML = '以字母开头，长度在6~18之间，只能包含字母、数字和下划线'
                        can2[1] = 0;
                        console.log('空');
                    } else {
                        messages[i + 4].className = 'lg_password_message iconfont icon-cuowu wrong'
                        messages[i + 4].innerHTML = '您输入的密码不符合要求'
                        can2[1] = 0;
                    }
                } else {
                    messages[i + 4].className = 'lg_password_message iconfont icon-zhengque right'
                    messages[i + 4].innerHTML = '您输入的密码格式正确'
                    can2[1] = 1;
                }
            }
        }
    }
//点击登录按钮判断格式封装
var lg_click = function () {
    for (let i = 0; i < lg_inputs.length; i++) {
        messages[i + 4].style.fontSize = '16px'
            if (i == 0) {
                if (!username_reg.test(lg_inputs[i].value)) {
                    if (this.value == '') {
                        messages[i + 4].className = 'lg_username_message iconfont icon-denglu'
                        messages[i + 4].innerHTML = '请输入10位数字'
                        can2[0] = 0;
                        console.log('空');
                    } else {
                        console.log('错误');
                        messages[i + 4].className = 'lg_username_message iconfont icon-cuowu wrong'
                        messages[i + 4].innerHTML = '您输入的账号不符合要求'
                        can2[0] = 0;
                    }
                } else {
                    messages[i + 4].className = 'lg_username_message iconfont icon-zhengque right'
                    messages[i + 4].innerHTML = '您输入的账号格式正确'
                    can2[0] = 1;
                    console.log(1);
                }
            }
            if (i == 1) {
                if (!password_reg.test(lg_inputs[i].value)) {
                    if (this.value == '') {
                        messages[i + 4].className = 'lg_password_message iconfont icon-mima2'
                        messages[i + 4].innerHTML = '以字母开头，长度在6~18之间，只能包含字母、数字和下划线'
                        can2[1] = 0;
                        console.log('空');
                    } else {
                        messages[i + 4].className = 'lg_password_message iconfont icon-cuowu wrong'
                        messages[i + 4].innerHTML = '您输入的密码不符合要求'
                        can2[1] = 0;
                    }
                } else {
                    messages[i + 4].className = 'lg_password_message iconfont icon-zhengque right'
                    messages[i + 4].innerHTML = '您输入的密码格式正确'
                    can2[1] = 1;
                }
            }
    }
}
//点击登录按钮判断格式封装结束
//登录提醒结束

//登录注册确认按钮开始
//按钮点击效果
var re_btns = document.querySelectorAll('.re_button');
var lg_btn = document.querySelector('.lg_button');
    
    

re_btns[0].addEventListener('mousemove', function () {
        for (let i = 0; i < can.length; i++) {
            if (can[i] == 0) {
                re_btns[0].style.disabled = 'true';
                break;
            } else {
                re_btns[0].style.disabled = 'false';
            }
            };
});

    //清空按钮效果
    var delete_btn = document.getElementById('re_delete');
    delete_btn.addEventListener('click', function () {
        for (let i = 0; i < re_inputs.length; i++) {
            re_inputs[i].value = '';
            if (i == 0) {
                        messages[i].className = 're_username_message iconfont icon-zhuce'
                        messages[i].innerHTML = '请输入10位数字'
            }
            if (i == 1) {
                
                        messages[i].className = 're_password_message iconfont icon-mima2'
                        messages[i].innerHTML = '以字母开头，长度在6~18之间，只能包含字母、数字和下划线'
            }
            if (i == 2) {
               
                        messages[i].className = 're_name_message iconfont icon-denglu'
                        messages[i].innerHTML = '请输入2~10位汉字'
            }
            if (i == 3) {
                        messages[i].className = 're_phone_message iconfont icon-shouji'
                        messages[i].innerHTML = '请输入13位电话号码'
            }

        }
    })

//弹出框方法
var alert = document.querySelector('.alert');
let re_sure = document.getElementById('re_sure');
let lg_sure = document.getElementById('lg_sure');

function alert_jump() {
    alert.style.display = 'block';
}

let re_judge = 1;
re_sure.onclick = function () {
    //遍历循环，判断格式是否正确
    for (let i = 0; i < can.length; i++) {
        if (can[i] == 0) {
            //格式错误则无法提交
            alert.innerHTML = "亲，您的格式不对或有未填项噢";
            alert_jump();
            setTimeout(function () {
                alert.style.display = 'none';
            }, 2000);
            // alert('亲，您的格式不对或有未填项噢！');
            re_judge = 0;
            break;
        }
    };
    if (re_judge == 1) {
        re_sure_request();
    };        
};

let lg_judge = 1;
lg_sure.onclick = function () {
    lg_click();
    for (let i = 0; i < can2.length; i++) {
        if (can2[i] == 0) {
            console.log(can2[0]);
            console.log(can2[1]);
            alert.innerHTML = "亲，您的格式不对或有未填项噢";
            alert_jump();
            setTimeout(function () {
                alert.style.display = 'none';
            }, 2000);
            lg_judge = 0;
            break;
        }  
    };
    if (lg_judge == 1) {
        lg_sure_request();
    }
};
//弹出框方法结束
//登录注册确认按钮结束


//在账号信息内点击返回首页
var from_btn = document.getElementById('from_btn');
from_btn.addEventListener('click', function () {
    personal_interface.style.display = "none";
})

//点击账号信息头像后，可上传头像
var img_cover = document.querySelector('.img_cover')
var push_new_photo = document.querySelector('.push_new_photo');
img_cover.addEventListener('click', function () {
    push_new_photo.style.display = 'block';
})

//上传头像
var change_photo_sure = document.getElementById('change_photo_sure');
var new_photo_input = document.querySelector('.new_photo_input');
var new_photo_btn = document.querySelector('.new_photo_btn');
//将上传头像input的file转换为button上
function showFileInput() {
    new_photo_input.click();
}
var new_photo_file = document.querySelector(".push_new_photo input[type='file']");
// console.log(new_photo_file);
new_photo_file.addEventListener("change", assign, false);
function assign() {
    new_photo_btn.innerHTML = new_photo_file.value;
    console.log(new_photo_file.value);
    if (new_photo_file.value === "") {
        new_photo_btn.innerHTML = "选择文件（头像需宽高对称）";
    }
}


change_photo_sure.addEventListener('click', function () {

    var change_photo_obj = new_photo_input.files[0];
    // console.log(new_photo_input.files[0]);
    //转换为表单的形式
    let change_photo_data = new FormData();
    //在data中加入参数，形成表单
    change_photo_data.append("id", lg_data.id);
    change_photo_data.append("avatar", change_photo_obj);
    ajax_request("http://www.rushmc.top/api/updateAvatar", "post", change_photo_data);
    push_new_photo.style.display = "none";
})
//让头像实时显示的方法
function change_photo(change_photo_return_data) {
        user_profile.src = "http://www.rushmc.top/" + change_photo_return_data;
        my_photo_img.src = "http://www.rushmc.top/" + change_photo_return_data;
}


//取消上传头像
var change_photo_delete = document.getElementById('change_photo_delete');
change_photo_delete.addEventListener('click', function () {
    push_new_photo.style.display = "none";
})
//上传头像结束

//修改密码
var account_input_password = document.querySelector('.account_input_password');
var change_password_btn = document.querySelector('.change_password_btn');
var change_password_sureBtn = document.querySelector('.change_password_sureBtn');
var change_password_deleteBtn = document.querySelector('.change_password_deleteBtn');


change_password_btn.addEventListener('click', function () {
    // console.log('ok');
    // console.log(account_input_password.readOnly);
    account_input_password.readOnly = false;
    account_input_password.focus();
    change_password_btn.style.display = "none";
    change_password_sureBtn.style.display = "block";
    change_password_deleteBtn.style.display = "block";
})
change_password_sureBtn.addEventListener('click', function () {
    console.log(account_input_password.value);
    let change_password_data = new FormData();
    //在data中加入参数，形成表单
    change_password_data.append("id", lg_data.id);
    change_password_data.append("newPassword", account_input_password.value);
    ajax_request("http://www.rushmc.top/api/passwordUpdate","post", change_password_data);
    change_password_btn.style.display = "block";
    change_password_sureBtn.style.display = "none";
    change_password_deleteBtn.style.display = "none";
    account_input_password.blur();
    account_input_password.readOnly = true;
})
change_password_deleteBtn.addEventListener('click', function () {
    change_password_btn.style.display = "block";
    change_password_sureBtn.style.display = "none";
    change_password_deleteBtn.style.display = "none";
    account_input_password.blur();
    account_input_password.readOnly = true;
})
//修改密码结束

//所有动态渲染开始
var all_trends = document.querySelector('.all_trends');
ajax_request("http://www.rushmc.top/api/dynamicState/select/all", "get");
// 创造节点
 //判定用户动态是否发了图片，若无则显示默认图片

 //判断一些错误的数据内容并且返回照片
function data_judge(judge_data, num, imgs) {
    if (judge_data[num].content == null) {
        // continue;
        judge_data[num].content = "无内容";
    }
    if (judge_data[num].title == null) {
        // continue;
        judge_data[num].title = "无标题";
    }
    if (judge_data[num].content == "undefined") {
        // continue; 
        judge_data[num].content = "内容错误"
    }
    if (judge_data[num].title == "undefined") {
        // continue; 
        judge_data[num].title = "标题错误"
    }
    if (judge_data[num].urls[0] == undefined || judge_data[num].urls[0] == null) {
        imgs = "./img/默认.jpg";
    } else {
        // console.log(consumer_trends_photo);
        // consumer_trends_photo.onerror = "this.src = './img/默认.jpg'";
        imgs = "http://www.rushmc.top/" + judge_data[num].urls[0];
        console.log(imgs);
    }
    return imgs
}
 
function createDom(dataList) {
    let htmlStr = "";
    let len = dataList.length;
    for (let i = 0; i < len; i++) {
        var all_img_src = data_judge(dataList, i, all_img_src);;
        htmlStr += getHtmlStr(dataList[i], all_img_src);
    }
    // console.log(htmlStr);
    all_trends.innerHTML = htmlStr;
  }
  // 获取模板字符串

//分离传过来的时间
function split_time(catch_data) {
     //将时间字符串进行分隔
     let push_year_datas = catch_data.creationTime.split("T");
     let push_year = push_year_datas[0];
     let push_time_datas = push_year_datas[1].split(".");
     let push_time = push_time_datas[0];
    let time = push_year + "\xa0\xa0\xa0\xa0" + push_time;
    return time;
}

function getHtmlStr(data, img_src) {
    var all_consumer_time = split_time(data);
    // console.log(img_src);
    let template = '<div class="one_in_all"><h3>' +
        data.title + '</h3><div class="consumer_content_banner"><div class="consumer_img"><img src=" ' +
        img_src +
        ' " alt=""></div><div class="simple_content"> ' +
        data.content +
        '</div></div><div class="consumer_source"><span class="from"> 来自' +
        data.username +
        '</span><span class="pubtime"> ' +
        all_consumer_time + '</span></div></div> ';
    
    return template;
}
//所有动态渲染结束


//个人动态界面开始
var my_trend_top_img = document.querySelector('.my_trend_top').querySelector('img');
console.log(my_trend_top_img);
//个人动态搜索框焦点获得
var my_search_box = document.querySelector('.my_search_box');
var search_trend = document.querySelector('.search_trend');

my_search_box.addEventListener('mouseover', function () {
    search_trend.focus();
})
my_search_box.addEventListener('mouseout', function () {
    search_trend.blur();
})

var xinjian_trend = document.querySelector('.icon-xinjian');
var my_trends_alert = document.querySelector('.my_trends_alert');

//点击新建跳转到发布动态界面
xinjian_trend.addEventListener('click', function () {
    push_my_trends.style.display = "flex";
    my_trends_alert.style.display = "none";
    all_my_trends.style.display = "none";
})
//个人动态界面结束

//发布动态开始 
var my_title_input = document.querySelector('.my_title_input');
var my_content = document.querySelector('.my_content');
var add_pic = document.getElementById('add_pic');
var push_trends_sure = document.querySelector('.push_trends_sure');
var pushtrends_delete = document.querySelector('.pushtrends_delete');
var push_my_trends = document.querySelector('.push_my_trends');
var hasPicture = 0;


//上传多张图片并且预览
var my_pic = document.querySelector('.my_pic');
var my_pic_box = document.querySelector('.my_pic_box');
//预览方法
add_pic.addEventListener("change", setpic, false);
function setpic() {
    add_pic.style.display = "none";
    for (let i = 0; i < add_pic.files.length; i++) {
        //将文件转换成base64
        let reader_arr = new FileReader();
        reader_arr.readAsDataURL(add_pic.files[i]);
        reader_arr.onload = function () {
            // console.log(this.result);
            //通过base64将图片绝对路径附上去，因为绝对路径一般被浏览器隐藏了
            var path = this.result;
            // setpic(add_pic_len , imgs_path);
            // console.log(add_pic.files[i].name);
            var my_pic_div = document.createElement('div');
            my_pic_div.innerHTML = '<div class="one_in_pic"><img src="' +
            path + '" alt="" class="one_in_img"></div>'
            my_pic_box.appendChild(my_pic_div);
        }
    }
}

//发送
push_trends_sure.addEventListener('click', function () {
    //判断有无图片
    if (add_pic.files.length != 0) {
        hasPicture = 1
    } else {

    }
    // console.log("ok");
    // console.log(lg_data.id);
    // console.log(my_content.innerHTML);
    // console.log(my_title_input.value);
    // console.log(hasPicture);
    // console.log(add_pic.files[0]);
    //转换为表单的形式
    let trend_data = new FormData();
    //在data中加入参数，形成表单
    trend_data.append("userId", lg_data.id);
    trend_data.append("content", my_content.innerHTML);
    trend_data.append("title", my_title_input.value);
    trend_data.append("hasPicture", hasPicture);
    for (let i = 0; i < add_pic.files.length; i++) {
        trend_data.append("files", add_pic.files[i]);
        console.log(add_pic.files[i]);
    }
    ajax_request("http://www.rushmc.top/api/dynamicState/insert", "post", trend_data);
})

//点击取消按钮后跳转到个人动态界面
pushtrends_delete.addEventListener('click', function () {
    push_my_trends.style.display = "none";
    // my_trends_alert.style.display = "block";
    all_my_trends.style.display = "block";
})
//发布动态结束



//获取个人动态开始
var all_my_trends = document.querySelector('.all_my_trends');
var my_img_src = 0;
// 创造节点
 //判定我的动态是否发了图片，若无则显示默认图片
function create_my_Dom(dataList) {
    let htmlStr = "";
    let len = dataList.length;
    //判断是否发过动态
    if (len != 0) {
        my_trends_alert.style.display = "none"
    }
    for (let i = 0; i < len; i++) {
        var my_img_src = data_judge(dataList, i, my_img_src);
        htmlStr += get_my_HtmlStr(dataList[i], my_img_src );
    }
    // console.log(htmlStr);
    all_my_trends.innerHTML = htmlStr;
  }
  // 获取模板字符串

//分离传过来的时间
function split_time(catch_data) {
     //将时间字符串进行分隔
     let push_year_datas = catch_data.creationTime.split("T");
     let push_year = push_year_datas[0];
     let push_time_datas = push_year_datas[1].split(".");
     let push_time = push_time_datas[0];
    let time = push_year + "\xa0\xa0\xa0\xa0" + push_time;
    return time;
}

function get_my_HtmlStr(data, img) {
    var my_time = split_time(data);
    let template = ' <div class="one_of_my"><div class="img_split"><img src=" ' +
        img + '" alt=""><div class="my_simple_content"> ' + data.content + '</div></div><div class="my_simple_trend_source"><div class="my_simple_title">' +
        data.title + '</div><div class="my_simple_time"> '+my_time+' </div></div></div>'
    return template;
}
//所有动态渲染结束
//获取个人动态结束